<template>
  <div>
    <Header
      :point="point"
      @setPoint="setPoint"
      @setListData="setListData"
    ></Header>
    <Login v-if="point" @setPoint="setPoint" @getListData="getListData"></Login>
    <List
      :lists="lists"
      @setDefaults="setDefaults"
      @getListData="getListData"
    ></List>
    <Show
      :defaults="defaults"
      :listdata="listdata"
      
    ></Show><!--@setRouter="setRouter"-->
    <router-view></router-view>
  </div>
</template>

<script>
import Header from "./components/Header.vue";
import Login from "./components/Login";
import List from "./components/List";
import Show from "./components/Show";
import VueCookies from "vue-cookies";
import axios from "axios";
import router from "./router";

export default {
  name: "App",
  router:router,
  components: {
    Header,
    Login,
    List,
    Show,
  },
  mounted() {
    // 生命钩子，挂载完毕时调用【自动点击首页出现路由组件】
    this.getListData("最新发布", 1);
  },
  methods: {
    setPoint: function () {
      this.point = !this.point;
    },
    setDefaults(data) {
      this.defaults = data;
    },
    getListData: function (gtype, onelink) {
      // gtype 为商品的类别：电器日用
      // 更新数据 listdata {id:'1',name:'数码相机',price:'580.00',date:"2020-05-14"},
      var uid = VueCookies.get("uid");
      var ucookie = VueCookies.get("ucookie");
      axios({
        method: "POST",
        url: "http://localhost:8081/lo/intercept/goods/getlistdata",
        params: { uid: uid, ucookie: ucookie, gtype },
        headers: {
          headers: {
            "Content-Type": "application/x-www-form-urlencoded",
          },
        },
      }).then(
        (response) => {
          // console.log(response.data);
          if (!response.data && !onelink) {
            // 第一次访问页面
            alert("请先登录");
          } else {
            // 对listdate进行赋值
            this.listdata = response.data;
          }
        },
        (error) => {
          alert("请求失败,请检查服务器是否开启！");
        }
      );
    },
    // setRouter: function () {
    //   // 让前面内容消失
    //   this.rou = !this.rou;
    // },
    setListData: function (listdata) {
      // 在header组件中的搜索查询后赋值给listdata
      this.listdata = listdata;
      // console.log("1");
    },
  },
  data() {
    return {
      point: 0, // 初始化登录注册界面
      uid: "",
      lists: [
        { text: "最新发布", id: "new" },
        { text: "闲置数码", id: "digital" },
        { text: "校园代步", id: "walking" },
        { text: "电器日用", id: "daily" },
        { text: "图书教材", id: "book" },
        { text: "美妆衣物", id: "clothes" },
        { text: "运动棋牌", id: "movement" },
        { text: "票卷小物", id: "ticket" },
      ],
      defaults: { text: "最新发布", id: "new" }, // 默认的格式
      listdata: [
        // {gid:'1',gname:'数码相机',price:'580.00',date:"2020-05-14"},
        // {gid:'2',gname:'笔记本电脑',price:'690.00',date:"2020-05-14"},
        // {gid:'3',gname:'台灯',price:'32.00',date:"2020-05-14"},
        // {gid:'4',gname:'数码相机',price:'580.00',date:"2020-05-14"},
        // {gid:'5',gname:'笔记本电脑',price:'690.00',date:"2020-05-14"},
        // {gid:'6',gname:'台灯',price:'32.00',date:"2020-05-14"},
        // {gid:'7',gname:'数码相机',price:'580.00',date:"2020-05-14"},
        // {gid:'8',gname:'笔记本电脑',price:'690.00',date:"2020-05-14"},
        // {gid:'9',gname:'台灯',price:'32.00',date:"2020-05-14"},
      ],
    };
  },
};
</script>

<style scoped>
div {
  /* overflow: hidden; */
  width: 100%;
  background-color: #eeeeee;
}
</style>
